<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:p="http://primefaces.org/ui"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core">

    <h:outputScript name="js/tree-additional-checkbox.js"/>

    <h:form id="administration-tree-form">

        <div style="display: table-cell">
            <p:selectOneMenu value="#{treeAdministrationBean.selectedGroupId}" >
                <f:selectItem itemLabel="Select..." noSelectionOption="true"/>
                <f:selectItems var="g" itemLabel="#{g.name}" itemValue="#{g.id}"
                               value="#{treeAdministrationBean.groups}"/>
                <p:ajax listener="#{treeAdministrationBean.onChangeGroup}"
                        update="tree-admin-comp-id checkbox_read-selection" oncomplete="TreeCustomBehavior.init();TreeCustomBehavior.initSelection();"/>
            </p:selectOneMenu>
        </div>
        <div style="display: table-cell">
            <p:commandButton icon="ui-icon-disk" actionListener="#{treeAdministrationBean.saveGroupRoles}" process="@form"/>
        </div>

        <p:tree id="tree-admin-comp-id"
                var="node"
                value="#{treeAdministrationBean.administrationRootModel}" dynamic="true"
                selection="#{treeAdministrationBean.selectedTreeNodes}"
                selectionMode="checkbox"
                styleClass="tree-administration tree-read-checkbox"
                style="border: none;width :480px;" propagateSelectionDown="false"
                propagateSelectionUp="true">

            <p:treeNode icon="#{node.treeNodeType.functionType.icon}" expandedIcon="ui-icon-folder-open" collapsedIcon="ui-icon-folder-collapsed">
                <h:outputText value="#{node.name}"/>
            </p:treeNode>

        </p:tree>

        <h:inputHidden id="checkbox_read-selection" value="#{treeAdministrationBean.writeRoleSelection}"/>

    </h:form>

</ui:composition>